<template>
  <div :class="wrapClasses"
       :style="wrapStyles">
    <!--label-->
    <label :class="labelClasses"
           :for="elementId"
           :style="labelStyles"
           v-if="isShowLabel">
      <slot name="label">{{label}}</slot>
    </label>
    <input :id="elementId"
           ref="input"
           :class="inputClasses"
           :value="formatValue"
           v-bind="inputAttrs"
           v-on="inputListeners" />
    <div :class="handlerClasses">
      <a
        @click="up($event)"
        @mousedown="preventDefault($event)"
        :class="upClasses">
        <span :class="innerUpClasses" @click="preventDefault"></span>
      </a>
      <a
        @click="down($event)"
        @mousedown="preventDefault($event)"
        :class="downClasses">
        <span :class="innerDownClasses" @click="preventDefault"></span>
      </a>
    </div>
    <!--验证提示-->
    <div :class="errorTipClasses"
         :style="errorTipStyles"
         v-if="isShowMessage">
      {{validateMessage}}
    </div>
  </div>
</template>
<script type="text/ecmascript-6"  src="./index.js"></script>
